<template>
	<view class="import">
		<view @click="numberClick('?')">？</view>
		<view @click="numberClick(1)">1</view>
		<view @click="numberClick(2)">2</view>
		<view @click="numberClick(3)">3</view>
		<view @click="numberClick(4)">4</view>
		<block  v-if="info.row  == 6 || info.row  == 9 ">
			<view @click="numberClick(5)">5</view>
			<view @click="numberClick(6)">6</view>
			
		</block>
		<block  v-if="info.row  == 9 ">
			<view @click="numberClick(7)">7</view>
			<view @click="numberClick(8)">8</view>
			<view @click="numberClick(9)">9</view>
		</block>	
		
	</view>
</template>

<script>
	export default {
		props: ['info'],
		data() {
			return {
			}
		},
		methods:{
			numberClick(e){
				this.$emit('numberChange',e);
			},
		}
	}
</script>

<style>
	.import {
		display: flex;
		/* justify-content: center; */
		flex-wrap: wrap;
	}
	.import > view {
		font-size: 44rpx;
		width: 100rpx;
		height: 100rpx;
		line-height: 100rpx;
		text-align: center;
		margin-left: 20rpx;
		margin-right: 20rpx;
		margin-bottom: 20rpx;
		border: 2rpx solid #e3e3e3;
	}
</style>